<!DOCTYPE html>
<html>
<head>
    <title>Extensible : Remote Calendar</title>
    <!-- Sets up all Ext and Extensible includes: -->
    <script type="text/javascript" src="../../../Extensible-config.js"></script>
    
    <!-- Page-specific includes -->
    <script type="text/javascript" src="remote.js"></script>
    <style>
        .sample-ct {
            /* pre-size the container for smoother rendering, should match the panel's height config */
            height: 700px;
        }
        #errChk label {
            cursor: pointer;
        }
        #errTitle {
            font-weight: bold;
            color: #AF1515;
        }
    </style>
</head>
<body>
    <div id="sample-overview">
        <h1>Remote Calendar Example</h1>
        <p>This sample uses a simple MVC-style PHP + REST implementation to demonstrate the ease with which you can hook a CalendarPanel
        up to a back end. In fact, the only changes are in the store (giving it a remote proxy and defining the REST API). The PHP code
        uses the session object for storage, allowing you to refresh the page without losing data. You can also use Firebug (or any other 
        tool that allows you to inspect XHR requests) to examine each request and verify that the proper HTTP verbs are being used when 
        calling the RESTful API.</p>
        <p>The calendar will automatically handle server errors, either via remote validation or non-200 HTTP response codes. If an editor
        is visible it will remain visible, and if an event was changed directly via a context menu or drag-and-drop the change will not be applied.</p>
        
        <p class="view-src"><a target="_blank" href="remote.js">View the source</a></p>
    </div>
    
    <p id="errChk"><label for="forceError"><input type="checkbox" id="forceError" name="forceError" /> Simulate server errors</label></p>
        
    <div id="cal" class="sample-ct"></div>
</body>
</html>